color: String

Sets the color of dataSeries. The value of color can be a “HTML Color Name” or “Hex Code”.

Default: Automatically set from Theme.
Example: “red”, “green” ..
Notes
  • If color is not set, in a single series chart, each dataPoint is given a new color, and in Multi-Series Chart, each dataSeries is given a different color.
  • When not set, color for each dataSeries/dataPoint is chosen from the user defined or default theme.
var  chart =  new  CanvasJS.Chart("container",
{
 .
 .
 data:[{
   color: "red",
  },
 ]
 .
 .
});
chart.render();

Try Editing The Code


If you have any questions, please feel free to ask in our forums.Ask Question

7 Comments

  1. Craig says:

    Is it possible to set a threshold for the color? For example if number is less than 80 then “red” else “green”

    • Craig says:

      Never mind I figured out how to do this utilizing variables and a JavaScript if/else statement

      //Set WMW Colorset
      if (wmwemp < 80) {
      var wmwempc = "red";
      } else {
      var wmwempc = "#4E83B8";
      }

      if (wmwcred < 80) {
      var wmwcredc = "red";
      } else {
      var wmwcredc = "#7fa6cc";
      }

      if (wmwmed < 80) {
      var wmwmedc = "red";
      } else {
      var wmwmedc = "#b6cce2";
      }

      CanvasJS.addColorSet("wmwcolorset",
      [wmwempc,
      wmwcredc,
      wmwmedc,
      ]);

If you have any questions, please feel free to ask in our forums. Ask Question